<template>
  <div>
    <van-nav-bar title="" left-text="返回" left-arrow @click-left="goback" />
    <van-address-list
      v-model="chosenAddressId"
      :list="addressList"
      @add="onAdd"
      @edit="onEdit"
      @select="onSelect"
    />
  </div>
</template>

<script>
import {
  addressList,
  addressDetail,
  addressSave,
  addressDelete,
} from '@/api/api';
import { AddressList, NavBar } from 'vant';
import { setLocalStorage } from '@/utils/local-storage';

export default {
  data() {
    return {
      chosenAddressId: -1,
      addressList: [],
      type: '',
    };
  },

  created() {
    this.type = this.$route.query.type;
    this.loadAddress();
  },
  methods: {
    onAdd() {
      this.$router.push({ name: 'address-edit', query: { addressId: -1 } });
    },
    onEdit(item, index) {
      this.$router.push({
        name: 'address-edit',
        query: { addressId: item.id },
      });
    },
    onSelect(item, index) {
      if (this.type == 'usercenter') {
        this.$router.push({
          name: 'address-edit',
          query: { addressId: item.id },
        });
      } else {
        setLocalStorage({ AddressId: item.id });
        this.$router.go(-1);
      }
    },
    goback() {
      this.$router.go(-1);
    },
    loadAddress() {
      addressList().then((res) => {
        var list = res.data.data.list;
        for (var i = 0; i < list.length; i++) {
          var item = list[i];
          this.addressList.push({
            id: item.id,
            name: item.name,
            tel: item.tel,
            address:
              item.province +
              item.city +
              item.county +
              ' ' +
              item.addressDetail,
          });
        }
      });
    },
  },

  components: {
    [NavBar.name]: NavBar,
    [AddressList.name]: AddressList,
  },
};
</script>


<style lang="scss" scoped>
/deep/ .van-nav-bar__left {
  //左上角返回字体加粗
  font-weight: bold;
}
.van-address-list__bottom {
  position: relative !important;
  background-color: #f2f2f2 !important;
  bottom: -98% !important;
}
/deep/ .van-address-list__add {
  height: 44px;
  line-height: 44px;
}
.addressGroup {
  margin-bottom: 10px;
  &:last-child {
    margin-bottom: 0;
  }
}

.bottom_btn {
  position: fixed;
  bottom: 0;
}
.van-nav-bar .van-icon {
  color: #ee3f00;
}
.van-nav-bar /deep/ .van-nav-bar__text {
  color: #ee3f00;
}
</style>
